<!DOCTYPE html>
<html lang="en">
<head>
    <base href="/">
    <meta charset="UTF-8">
    <title>填写订单信息</title>
    <link rel="stylesheet" href="settlement/css/index.css">
    <link rel="stylesheet" href="layui/css/layui.css">
    <style>

        .order_box_in {
            width: 400px;
            height: 170px;
            margin-left: 8px;
            margin-bottom: 20px;
            float: left;
            border: 1px solid #C9C5C5;
            border-radius: 5px;
            cursor: pointer;
        }

        .order_box::after {
            content: "";
            display: block;
            clear: both;
        }
    </style>
    <style>
        .order_box_in {
            border: 1px solid #C9C5C5;
            padding: 10px;
        }

        .addressname {
            height: 20px;
            font-weight: bold;
            color: orangered;
            text-align: center;
            font-size: 20px;
            padding: 5px;
        }

        .areatext {
            height: 15px;
            color: dodgerblue;
            text-align: left;
            font-size: 15px;
            padding: 5px;
        }

        .addresstext {
            height: 15px;
            color: dodgerblue;
            text-align: left;
            font-size: 15px;
            padding: 5px;
        }

        .addrname {
            height: 15px;
            color: darkgreen;
            text-align: left;
            font-size: 15px;
            padding: 5px;
        }

        .addrtel {
            height: 15px;
            color: dodgerblue;
            text-align: left;
            font-size: 15px;
            padding: 5px;
        }
    </style>
</head>
<body>
<div class="order_head">
    <div class="head_background">
        <div class="head_box">
            <a href="index.html" class="head_left_a"><img src="settlement/img/logo.jpg" alt="" class="head_left_p"></a>
            <h1 class="head_h1">请扫码支付</h1>
            <div class="head_right">
                <span class="head_right_in">1412625918 ∨</span>
                <span class="head_right_in">|</span>
                <a href="" class="head_right_in">我的订单</a>
            </div>

        </div>
    </div>
</div>
<div class="order_body layui-container">
    <img id="qrcode" src="easyfile/025cedcfc7715b15528533d75287c9db.jpeg">
</div>

<div class="foot">
    <ul class="foot_ul">
        <li class="foot_li">预约维修服务</li>
        <li class="foot_li">7天无理由退货</li>
        <li class="foot_li">15天免费换货</li>
        <li class="foot_li">满15元包邮</li>
        <li class="foot_li foot_fot">520余家售后网点</li>
    </ul>
    <div class="foot_center">
        <div class="foot_cen_left">
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
            <dl class="foot_dl">
                <dt class="foot_dt">帮助中心</dt>
                <dd class="foot_dd"><a>账户管理</a></dd>
                <dd class="foot_dd"><a>购物指南</a></dd>
                <dd class="foot_dd"><a>订单操作</a></dd>
            </dl>
        </div>
        <div class="foot_cen_right">
            <p class="foot-phone">400-100-5678</p>
            <p class="foot-right-center">周一至周日 8:00-18:00<br>（仅收市话费)</p>
            <a class="foot-right-bottmo" href="">联系客服</a>
        </div>
    </div>
</div>
<div class="fot_bot_max">
    <div class="fot_bot">
        <img src="settlement/img/logo.jpg" class="fot_bot_logo">
        <div class="fot_bot_text">
            <p class="fot_bot_p">
                <a class="fot_bot_a" href="">小米商城</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">MIUI</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">米家</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">米聊</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">多看</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">游戏</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">路由器</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">米粉卡</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">政企服务</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">小米天猫店</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">隐私政策</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">问题反馈</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">廉政举报</a>
                <span class="fot_bot_span">|</span>
                <a class="fot_bot_a" href="">Select Region</a>
            </p>
            <p class="fot_bot_p fot_bot_a1">
                "©"
                <a class="fot_bot_a1" href="">mi.con</a>
                " 京ICP证110507号"
                <a class="fot_bot_a1" href="">京ICP备10046444号</a>
                <a class="fot_bot_a1" href="">京公网安备11010802020134号</a>
                <a class="fot_bot_a1" href="">京网文[2017]1530-131号</a>
                "<br>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试"


            </p>
        </div>
        <div class="fot_bot_right">
            <a href="" class="fot_bot_right_img"><img src="settlement/img/foot_01.png" alt=""></a>
            <a href="" class="fot_bot_right_img"><img src="settlement/img/foot_02.png" alt=""></a>
            <a href="" class="fot_bot_right_img"><img src="settlement/img/foot_03.png" alt=""></a>
            <a href="" class="fot_bot_right_img"><img src="settlement/img/foot_04.png" alt=""></a>
            <a href="" class="fot_bot_right_img"><img src="settlement/img/foot_05.png" alt=""></a>
        </div>

    </div>
    <img class="fot_bottom_img" src="settlement/img/foot_06.png">
</div>
<script type="text/html" id="addressitem">
    <div easy="address" class='layui-col-md4'
         style="margin-top:10px;height:120px;border:1px solid orangered;border-radius: 10px;cursor: pointer">
        <div class='addressname' style="">
        </div>
        <div style="margin-top:8px">
            地址:<span class="areatext"></span>
        </div>
        <div class='' style="margin-top:8px;">
            详细地址:<span class="addresstext"></span>
        </div>
        <div class='layui-row' style="margin-top:8px;">
            <div class=' layui-col-md6'>
                联系人:<span class="addrname"></span>
            </div>
            <div class=' layui-col-md6'>
                联系电话:<span class="addrtel"></span>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="addAddress">
    <div class='layui-col-md4' addAddress
         style="margin-top:10px;height:120px;text-align: center;line-height: 120px;font-size: 30px;border-radius: 10px;border:1px solid orangered;cursor: pointer;">
        +
    </div>
</script>
<script id="productitem" type="text/html">
    <div class="layui-row" easy="proitem" style="height:50px;line-height: 50px;">
        <div class="layui-col-md5">
            <input type="hidden" name="id">
            <img easy="proimg" style="height: 18px; width: 27px" src="settlement/img/A4.png"
                 alt=""/>
            <span easy="proname">小米电视A4 32寸 黑色 32 寸</span>
        </div>
        <div class="layui-col-md2">
            <label class="layui-form-label"><span easy="proprice">899</span>元*</label>
            <div class="layui-input-block">
                <input type="text" style="width:40px;" name="number" easy="pronumber" class="layui-input">
            </div>
        </div>

        <div class="layui-col-md4" style="text-align: center;">
            <p easy="subtotal">899元</p>

        </div>
        <div class="layui-col-md1">
            <button type='button' easy="deletebtn"
                    class="layui-btn layui-btn-sm layui-btn-radius layui-btn-danger">删除
            </button>
        </div>
        <hr class="layui-border-orange">
    </div>
</script>
<script src="layui/layui.all.js"></script>
<script th:inline="javascript">
    const $ = layui.$;
    const layer = layui.layer;
    const form=layui.form;
    const id=/*[[${id}]]*/;//订单的id
    if(!id){
        location.href="shopping/index";
    }
    $.ajax({
        url:'order/payment',
        data:{id:id},
        success:function(result){
            let code=result.code;
            if(code==200){
                let imgcode=result.data;
                console.log(imgcode);
                $("#qrcode").attr("src","data:image/png;base64,"+imgcode);
            }else{
                layer.msg("订单异常",{icon:2});
                setTimeout(function(){
                    //location.href="shopping/index";
                },2000);

            }
        }
    });
</script>
</body>
</html>